<?php
session_start();
require_once 'config.php';

// ===== SISTEMA DE AFILIADOS (CAPTURA REF) =====
if (isset($_GET['ref']) && !empty($_GET['ref'])) {
    $referralCode = trim($_GET['ref']);
    $_SESSION['referrer_code'] = $referralCode;
    
    // Também salvar em cookie (30 dias) como backup
    setcookie('referrer_code', $referralCode, time() + (30 * 24 * 60 * 60), '/');
}

// Verificar modo de manutenção
try {
    $stmt = $pdo->query("SELECT setting_value FROM settings WHERE setting_key = 'maintenance_mode'");
    $maintenanceMode = $stmt->fetchColumn();
    if ($maintenanceMode == '1') {
        require_once 'maintenance.php';
        exit;
    }
} catch (Exception $e) {}

// Verificar se o cassino está ativado
$casinoEnabled = true;
try {
    $stmt = $pdo->query("SELECT setting_value FROM settings WHERE setting_key = 'casino_enabled'");
    $result = $stmt->fetchColumn();
    $casinoEnabled = ($result == '1');
    if (!$casinoEnabled) {
        header('Location: ./');
        exit;
    }
} catch (Exception $e) {}

// Verificar se a landpage está ativa
$landpageEnabled = false;
try {
    $stmt = $pdo->query("SELECT setting_value FROM settings WHERE setting_key = 'landpage_enabled'");
    $landpageEnabled = ($stmt->fetchColumn() == '1');
} catch (Exception $e) {}

// Verificar se os esportes estão ativados
$sportsEnabled = false;
try {
    $stmt = $pdo->query("SELECT setting_value FROM settings WHERE setting_key = 'sports_enabled'");
    $result = $stmt->fetchColumn();
    $sportsEnabled = ($result == '1');
} catch (Exception $e) {
    $sportsEnabled = false;
}

// Verificar modo de abertura de jogos (0 = modal, 1 = página dedicada)
$gameOpenMode = 0;
try {
    $stmt = $pdo->query("SELECT setting_value FROM settings WHERE setting_key = 'game_open_mode'");
    $result = $stmt->fetchColumn();
    $gameOpenMode = ($result == '1') ? 1 : 0;
} catch (Exception $e) {
    $gameOpenMode = 0;
}

// Contorno prata nos cards de jogo
$casinoCardBorder = false;
try {
    $stmt = $pdo->query("SELECT setting_value FROM extras WHERE setting_key = 'casino_cards_border'");
    $result = $stmt->fetchColumn();
    if ($result !== false) {
        $casinoCardBorder = ($result == '1');
    }
} catch (Exception $e) {}

// Bordas arredondadas dos cards de jogo
$casinoRounded = true;
try {
    $stmt = $pdo->query("SELECT setting_value FROM extras WHERE setting_key = 'casino_cards_rounded'");
    $result = $stmt->fetchColumn();
    if ($result !== false) {
        $casinoRounded = ($result == '1');
    }
} catch (Exception $e) {}

// Banner de instalação PWA
$pwaBannerEnabled = true;
try {
    $stmt = $pdo->query("SELECT setting_value FROM extras WHERE setting_key = 'pwa_banner_enabled'");
    $result = $stmt->fetchColumn();
    if ($result !== false) $pwaBannerEnabled = ($result == '1');
} catch (Exception $e) {}

// Grossura e brilho do contorno prata
$casinoCardBorderWidth = 1;
$casinoCardBorderGlow  = 40;
$casinoCardBorderColor = '#c0c6d2';
try {
    $stmt = $pdo->query("SELECT setting_key, setting_value FROM extras WHERE setting_key IN ('casino_cards_border_width','casino_cards_border_glow','casino_cards_border_color')");
    foreach ($stmt->fetchAll(PDO::FETCH_KEY_PAIR) as $k => $v) {
        if ($k === 'casino_cards_border_width') $casinoCardBorderWidth = max(1, min(4, (int)$v));
        if ($k === 'casino_cards_border_glow')  $casinoCardBorderGlow  = max(0, min(100, (int)$v));
        if ($k === 'casino_cards_border_color') $casinoCardBorderColor = preg_match('/^#[0-9a-fA-F]{6}$/', $v) ? $v : '#c0c6d2';
    }
} catch (Exception $e) {}

// Colunas mobile do carrossel de jogos
$casinoCols = 4;
try {
    $stmt = $pdo->query("SELECT setting_value FROM extras WHERE setting_key = 'casino_cols_mobile'");
    $result = $stmt->fetchColumn();
    if ($result !== false && in_array((string)$result, ['3','4','5'])) {
        $casinoCols = (int)$result;
    }
} catch (Exception $e) {}

// Verificar login do usuário
$isLoggedIn = isset($_SESSION['user_id']);
$userId = $isLoggedIn ? $_SESSION['user_id'] : null;
$username = '';
$userBalance = 0;

if ($isLoggedIn) {
    try {
        $stmt = $pdo->prepare("SELECT username, balance FROM users WHERE id = ?");
        $stmt->execute([$userId]);
        $user = $stmt->fetch(PDO::FETCH_ASSOC);
        if ($user) {
            $username = $user['username'];
            $userBalance = floatval($user['balance']);
            $_SESSION['username'] = $username;
            $_SESSION['balance'] = $userBalance;
        } else {
            session_destroy();
            $isLoggedIn = false;
        }
    } catch (Exception $e) {
        $userBalance = 0;
    }
}

// Buscar banners ativos
try {
    $stmt = $pdo->prepare("SELECT * FROM banners WHERE status = 'active' AND (section = 'casino' OR section = 'both') ORDER BY position ASC, created_at DESC");
    $stmt->execute();
    $banners = $stmt->fetchAll(PDO::FETCH_ASSOC);
} catch (Exception $e) {
    $banners = [];
}

// ===== CARREGAR CORES DO TEMA DO BANCO =====
$themeBgBody           = '#1a2c38';
$themeBgDarker         = '#0f212e';
$themeAccentGreen      = '#00e701';
$themeAccentGreenHover = '#00c201';
try {
    $stmt = $pdo->query("SELECT setting_key, setting_value FROM settings WHERE setting_key IN ('theme_bg_body','theme_bg_darker','theme_accent_green','theme_accent_green_hover','site_name')");
    $themeRows = $stmt->fetchAll(PDO::FETCH_KEY_PAIR);
    if (!empty($themeRows)) {
        $themeBgBody           = $themeRows['theme_bg_body']            ?? $themeBgBody;
        $themeBgDarker         = $themeRows['theme_bg_darker']          ?? $themeBgDarker;
        $themeAccentGreen      = $themeRows['theme_accent_green']       ?? $themeAccentGreen;
        $themeAccentGreenHover = $themeRows['theme_accent_green_hover'] ?? $themeAccentGreenHover;
    }
} catch (Exception $e) {}

// Nome do site: banco tem prioridade, fallback para constante config.php
$siteName = !empty($themeRows['site_name']) ? $themeRows['site_name'] : SITE_NAME;

// Buscar jogos por provedor - ORDENADOS por sort_order
$gamesByProvider = [];
try {
    $stmt = $pdo->query("SELECT g.*, p.name as provider_name, p.id as provider_id, p.sort_order as provider_order FROM casino_games g LEFT JOIN casino_providers p ON g.provider_id = p.id WHERE g.status = 'active' AND p.status = 'active' ORDER BY p.sort_order ASC, p.name ASC, g.featured DESC, g.sort_order ASC, g.name ASC");
    $allGames = $stmt->fetchAll(PDO::FETCH_ASSOC);
    foreach ($allGames as $game) {
        $providerId = $game['provider_id'];
        $providerName = $game['provider_name'] ?: 'Outros';
        if (!isset($gamesByProvider[$providerId])) {
            $gamesByProvider[$providerId] = ['name' => $providerName, 'games' => []];
        }
        $gamesByProvider[$providerId]['games'][] = $game;
    }
} catch (Exception $e) {}
?>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="theme-color" content="<?php echo htmlspecialchars($themeBgDarker); ?>">
<title>Cassino - <?php echo htmlspecialchars($siteName); ?></title>

<!-- ===== FAVICONS – gerados via realfavicongenerator.net ===== -->
<link rel="apple-touch-icon" sizes="180x180"       href="apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32"    href="favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16"    href="favicon-16x16.png">
<link rel="icon" type="image/png" sizes="192x192"  href="android-chrome-192x192.png">
<link rel="icon" type="image/png" sizes="512x512"  href="android-chrome-512x512.png">
<link rel="shortcut icon"                          href="fiveicon.ico">
<link rel="manifest"                               href="manifest.php">
<link rel="mask-icon"                              href="safari-pinned-tab.svg" color="<?php echo $themeAccentGreen; ?>">
<meta name="msapplication-TileColor"              content="<?php echo $themeBgDarker; ?>">
<meta name="msapplication-config"                 content="browserconfig.xml">
<!-- ========================================================= -->

<?php include 'facebook-pixel-header.php'; ?>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link rel="stylesheet" href="mytabbar.css">
<style>
:root{--bg-body:<?php echo $themeBgBody; ?>;--bg-darker:<?php echo $themeBgDarker; ?>;--bg-card:#213743;--bg-hover:#2f4553;--bg-input:#0f212e;--text-primary:#fff;--text-white:#fff;--text-secondary:#b1bad3;--text-muted:#b1bad3;--accent-green:<?php echo $themeAccentGreen; ?>;--accent-green-hover:<?php echo $themeAccentGreenHover; ?>;--danger:#ff4454;--warning:#ffbf00;--border-color:#2f4553;--radius-md:8px;--font-main:'Inter',sans-serif}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{overflow-x:hidden;width:100%;max-width:100vw}
body{font-family:'Inter',sans-serif;background:var(--bg-body);color:var(--text-white);-webkit-font-smoothing:antialiased;padding-bottom:0;min-height:100vh;display:flex;flex-direction:column}
.main-nav{background:var(--bg-darker);border-bottom:1px solid var(--border-color);position:sticky;top:60px;z-index:100}
.nav-container{max-width:1560px;margin:0 auto;display:flex;padding:0 20px;width:100%}
.nav-link{display:flex;align-items:center;gap:8px;padding:14px 20px;color:var(--text-muted);text-decoration:none;font-size:14px;font-weight:700;border-bottom:2px solid transparent;transition:.2s}
.nav-link:hover{color:var(--text-white);background:rgba(255,255,255,.03)}
.nav-link.active{color:var(--text-white);border-bottom-color:var(--accent-green)}
.nav-link i{font-size:16px}
.banner-carousel-container{position:relative;width:calc(100% - 40px);max-width:1560px;margin:20px auto;overflow:hidden;border-radius:12px;box-shadow:0 4px 15px rgba(0,0,0,.2)}
.banner-carousel{position:relative;width:100%;height:0;padding-bottom:35%;overflow:hidden}
.banner-slide{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:opacity .8s ease-in-out;pointer-events:none}
.banner-slide.active{opacity:1;pointer-events:auto}
.banner-slide img{width:100%;height:100%;object-fit:cover;display:block}
.banner-slide a{display:block;width:100%;height:100%}
.banner-indicators{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:10}
.banner-indicator{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.5);border:none;cursor:pointer;transition:all .3s ease;padding:0}
.banner-indicator:hover{background:rgba(255,255,255,.8);transform:scale(1.2)}
.banner-indicator.active{background:var(--accent-green);width:30px;border-radius:5px}
.container{max-width:1560px;margin:0 auto;padding:0 20px 40px;width:100%;overflow:hidden;flex:1;min-height:60vh}
.search-bar{background:var(--bg-darker);border-radius:30px;padding:12px 20px;display:flex;align-items:center;gap:12px;margin-top:5px;margin-bottom:24px;border:1px solid transparent}
.search-bar:focus-within{border-color:var(--bg-hover)}
.search-bar .search-icon{color:var(--text-muted);transition:opacity .15s;flex-shrink:0}
.search-bar input{flex:1;background:none;border:none;color:var(--text-white);font-size:14px;font-weight:500;outline:none}
.search-bar input::placeholder{color:var(--text-muted)}
.search-spinner{width:14px;height:14px;border:2px solid rgba(var(--accent-rgb,255,255,255),.15);border-top:2px solid var(--accent-green);border-radius:50%;animation:srSpin .55s linear infinite;flex-shrink:0;display:none}
@keyframes srSpin{to{transform:rotate(360deg)}}
.game-section{margin-bottom:40px}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px;padding:0 5px;gap:8px}
.section-title{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;color:var(--text-white);min-width:0;flex:1}
.section-title span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.section-title i{color:var(--accent-green);font-size:20px;flex-shrink:0}
.game-count{font-size:13px;font-weight:500;color:var(--text-muted);margin-left:5px}
.section-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.btn-ver-todos{
    background:var(--bg-card);
    border:1px solid var(--border-color);
    color:var(--text-white);
    padding:8px 16px;
    border-radius:8px;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    transition:all .2s;
    display:flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
    flex-shrink:0;
}
.btn-ver-todos:hover{
    background:var(--accent-green);
    color:#011e28;
    border-color:var(--accent-green);
    transform:translateY(-2px);
}
.btn-ver-todos i{font-size:12px}
.nav-buttons{display:flex;gap:8px}
.nav-btn{width:36px;height:36px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:8px;color:var(--text-white);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;font-size:14px}
.nav-btn:hover:not(:disabled){background:var(--bg-hover);border-color:var(--accent-green);color:var(--accent-green)}
.nav-btn:disabled{opacity:.3;cursor:not-allowed}
.games-carousel{position:relative;overflow:hidden}
.games-scroll{display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;padding:5px}
.games-scroll::-webkit-scrollbar{display:none}
.game-card{width:calc((100% - 60px)/6);min-width:calc((100% - 60px)/6);flex-shrink:0;background:var(--bg-card);border-radius:<?php echo $casinoRounded ? '12px' : '0'; ?>;overflow:hidden;cursor:pointer;transition:.2s;position:relative;border:<?php
if($casinoCardBorder){
    $hex=ltrim($casinoCardBorderColor,'#');
    $r=hexdec(substr($hex,0,2));$g=hexdec(substr($hex,2,2));$b=hexdec(substr($hex,4,2));
    $op=round(0.30+($casinoCardBorderGlow/100)*0.65,2);
    echo $casinoCardBorderWidth.'px solid rgba('.$r.','.$g.','.$b.','.$op.')';
}else{echo 'none';}
?>;box-shadow:<?php if($casinoCardBorder){
    $hex2=ltrim($casinoCardBorderColor,'#');
    $r2=hexdec(substr($hex2,0,2));$g2=hexdec(substr($hex2,2,2));$b2=hexdec(substr($hex2,4,2));
    $glowPx=round($casinoCardBorderGlow/100*14,1);
    $glowOp=round($casinoCardBorderGlow/100*0.55,2);
    $refOp=round(0.10+$casinoCardBorderGlow/100*0.20,2);
    echo '0 0 '.$glowPx.'px rgba('.$r2.','.$g2.','.$b2.','.$glowOp.'),0 1px 0 rgba(255,255,255,'.$refOp.') inset,0 -1px 0 rgba(255,255,255,'.round($refOp*0.4,2).') inset';
}else{echo 'none';} ?>}
.game-card:hover{transform:translateY(-4px)}
.game-card:active{transform:translateY(0)}
.game-image-wrapper{width:100%;padding-bottom:140%;background:#ecf0f1;position:relative;overflow:hidden}
.game-image-wrapper img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.game-image-placeholder{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#95a5a6;font-size:48px}
.game-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.4) 40%,transparent 70%);display:flex;flex-direction:column;justify-content:flex-end;padding:15px;opacity:0;transition:opacity .2s ease;pointer-events:none}
.game-card:hover .game-overlay,.game-card.selected .game-overlay{opacity:1;pointer-events:auto}
.game-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-60%);width:52px;height:52px;display:flex;align-items:center;justify-content:center;cursor:pointer;background:none;border:none;padding:0;transition:transform .15s ease}
.game-play-btn svg{fill:var(--accent-green);width:52px;height:52px;filter:drop-shadow(0 2px 8px rgba(0,0,0,.7));transition:transform .15s ease}
.game-play-btn:hover svg{transform:scale(1.12)}
.game-name{font-size:15px;font-weight:700;color:var(--text-white);margin-bottom:4px;text-shadow:0 2px 8px rgba(0,0,0,.8);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.game-provider{font-size:11px;color:var(--text-muted);text-shadow:0 2px 8px rgba(0,0,0,.8);text-transform:uppercase;font-weight:600}
.game-badge{position:absolute;top:10px;right:10px;background:var(--accent-green);color:#011e28;padding:5px 10px;border-radius:6px;font-size:10px;font-weight:800;text-transform:uppercase;box-shadow:0 4px 12px rgba(0,231,1,.4);z-index:1}
.no-games{text-align:center;padding:60px 20px;color:var(--text-muted)}
.game-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.95);z-index:9999}
.game-modal.active{display:flex;align-items:center;justify-content:center}
.modal-content{width:100%;max-width:1200px;height:80vh;background:var(--bg-card);border-radius:12px;overflow:hidden;margin:20px}
.modal-header{background:var(--bg-darker);padding:15px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color)}
.modal-title{font-size:16px;font-weight:700;color:var(--text-white)}
.close-btn{background:none;border:none;color:var(--text-muted);font-size:24px;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px}
.close-btn:hover{background:var(--bg-card);color:var(--text-white)}
.game-iframe{width:100%;height:calc(100% - 60px);border:none}
.error-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.85);z-index:10000;align-items:center;justify-content:center;animation:fadeIn .3s ease}
.error-modal.active{display:flex}
.error-content{background:var(--bg-card);border-radius:12px;padding:30px;max-width:450px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.5);animation:slideUp .3s ease;text-align:center}
@keyframes slideUp{from{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}
.error-icon{width:70px;height:70px;margin:0 auto 20px;background:rgba(255,68,84,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid #ff4454}
.error-icon i{font-size:32px;color:#ff4454}
.error-title{font-size:20px;font-weight:700;color:var(--text-white);margin-bottom:12px}
.error-message{font-size:14px;color:var(--text-muted);line-height:1.6;margin-bottom:25px;white-space:pre-line}
.error-buttons{display:flex;gap:10px;justify-content:center}
.error-btn{padding:12px 24px;border-radius:6px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s;border:none;outline:none}
.error-btn-primary{background:var(--accent-green);color:#011e28}
.error-btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}
.error-btn-secondary{background:transparent;color:var(--text-muted);border:1px solid var(--border-color)}
.error-btn-secondary:hover{background:var(--bg-darker);color:var(--text-white)}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
/* ===== APP INSTALL BANNER ===== */
#appBanner{position:relative;top:0;left:0;width:100%;z-index:9999;background:var(--bg-darker);border-bottom:1px solid var(--border-color);display:flex;align-items:center;gap:10px;padding:8px 14px;box-shadow:0 2px 12px rgba(0,0,0,.4);animation:slideDown .3s ease}
#appBanner.hidden{display:none}
@keyframes slideDown{from{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}
.app-banner-close{background:none;border:none;color:var(--text-muted);font-size:18px;cursor:pointer;padding:2px 6px;flex-shrink:0;line-height:1;transition:.2s}
.app-banner-close:hover{color:var(--text-white)}
.app-banner-icon{width:40px;height:40px;border-radius:10px;object-fit:cover;flex-shrink:0;background:var(--bg-card)}
.app-banner-info{flex:1;min-width:0}
.app-banner-title{font-size:13px;font-weight:700;color:var(--text-white);line-height:1.2}
.app-banner-sub{font-size:11px;color:var(--text-muted);margin-top:2px}
.app-banner-btn{background:var(--accent-green);color:#011e28;border:none;border-radius:20px;padding:7px 16px;font-size:13px;font-weight:700;cursor:pointer;flex-shrink:0;text-decoration:none;transition:.2s;white-space:nowrap}
.app-banner-btn:hover{background:var(--accent-green-hover);transform:scale(1.04)}
/* ============================== */
@media (max-width:768px){
body,html{overflow-x:hidden;max-width:100vw}
.banner-carousel-container{margin:15px 0;border-radius:0;width:100%;max-width:100vw}
.banner-carousel{padding-bottom:50%}
.banner-slide img{object-fit:contain}
.banner-indicators{bottom:10px;gap:6px}
.banner-indicator{width:8px;height:8px}
.banner-indicator.active{width:24px}
.nav-container{padding:0 10px}
.game-card{width:calc((100% - <?php echo ($casinoCols-1)*12; ?>px)/<?php echo $casinoCols; ?>);min-width:calc((100% - <?php echo ($casinoCols-1)*12; ?>px)/<?php echo $casinoCols; ?>)}
.game-image-placeholder{font-size:32px}
.section-title{font-size:16px}
.game-count{font-size:12px}
.game-name{font-size:12px}
.game-provider{font-size:9px}
.container{padding:0 10px 20px;max-width:100%}
.modal-content{height:90vh;max-width:100%;border-radius:0;margin:0}
.game-badge{font-size:9px;padding:4px 8px}
.nav-btn{width:32px;height:32px;font-size:12px}
.game-overlay{padding:10px}
.btn-ver-todos{
    padding:6px 12px;
    font-size:11px;
}
.btn-ver-todos i{font-size:10px}
.section-actions{gap:6px}
}
</style>
</head>
<body>
<?php
// Resolve o ícone do app — verifica qual arquivo existe na raiz
$_pwaIconCandidates = [
    'android-chrome-192x192.png',
    'android-chrome-96x96.png',
    'apple-touch-icon.png',
    'fiveicon.svg',
    'fiveicon.ico',
];
$_pwaIcon = '';
foreach ($_pwaIconCandidates as $_c) {
    if (file_exists(__DIR__ . '/' . $_c)) { $_pwaIcon = $_c; break; }
}
?>
<!-- ===== BANNER INSTALAR APP ===== -->
<?php if($pwaBannerEnabled): ?>
<div id="appBanner" class="hidden">
    <button class="app-banner-close" onclick="askDismissBanner()" aria-label="Fechar">&#x2715;</button>
    <img class="app-banner-icon" src="<?php echo htmlspecialchars($_pwaIcon); ?>" alt="<?php echo htmlspecialchars($siteName); ?>">
    <div class="app-banner-info">
        <div class="app-banner-title"><?php echo htmlspecialchars($siteName); ?></div>
        <div class="app-banner-sub">Melhor experiência no app</div>
    </div>
    <button class="app-banner-btn" id="appBannerLink">Baixar App</button>
</div>
<?php endif; ?>
<!-- ================================= -->

<!-- ===== POPUP CONFIRMAR FECHAR BANNER ===== -->
<style>
#bannerDismissPopup{
    display:none;
    position:fixed;
    inset:0;
    z-index:999999;
    background:rgba(0,0,0,.7);
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
    align-items:center;
    justify-content:center;
}
#bannerDismissPopup.active{display:flex}
#bannerDismissBox{
    background:var(--bg-card);
    border:1px solid var(--border-color);
    border-radius:16px;
    padding:26px 22px;
    width:88%;
    max-width:300px;
    box-shadow:0 16px 48px rgba(0,0,0,.6);
    text-align:center;
    animation:bdSlideIn .25s cubic-bezier(.22,1,.36,1);
}
@keyframes bdSlideIn{from{transform:scale(.88);opacity:0}to{transform:scale(1);opacity:1}}
.bd-icon{width:46px;height:46px;border-radius:50%;background:var(--bg-darker);border:1px solid var(--border-color);display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.bd-title{font-size:15px;font-weight:700;color:var(--text-white);margin-bottom:8px}
.bd-text{font-size:12px;color:var(--text-secondary);line-height:1.6;margin-bottom:20px}
.bd-checkbox-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:20px;cursor:pointer}
.bd-checkbox-row input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent-green);cursor:pointer}
.bd-checkbox-row label{font-size:13px;color:var(--text-secondary);cursor:pointer}
.bd-buttons{display:flex;gap:10px}
.bd-btn-cancel{flex:1;padding:11px;border-radius:8px;border:1px solid var(--border-color);background:transparent;color:var(--text-secondary);font-size:13px;font-weight:600;cursor:pointer;font-family:var(--font-main);transition:.2s}
.bd-btn-cancel:hover{background:var(--bg-hover);color:var(--text-white)}
.bd-btn-confirm{flex:1;padding:11px;border-radius:8px;border:none;background:var(--accent-green);color:#011e28;font-size:13px;font-weight:700;cursor:pointer;font-family:var(--font-main);transition:.2s}
.bd-btn-confirm:hover{background:var(--accent-green-hover)}
</style>
<div id="bannerDismissPopup">
    <div id="bannerDismissBox">
        <div class="bd-icon">
            <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="var(--text-secondary)" stroke-width="2" stroke-linecap="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
        </div>
        <div class="bd-title">Fechar aviso?</div>
        <div class="bd-text">Se fechar agora, o aviso de instalação do app vai continuar aparecendo nas próximas visitas.</div>
        <label class="bd-checkbox-row">
            <input type="checkbox" id="bdDontShowCheck">
            <span>Não mostrar mais hoje</span>
        </label>
        <div class="bd-buttons">
            <button class="bd-btn-cancel" onclick="cancelDismissBanner()">Cancelar</button>
            <button class="bd-btn-confirm" onclick="confirmDismissBanner()">Fechar</button>
        </div>
    </div>
</div>
<!-- =========================================== -->

<!-- ===== POPUP INSTALAÇÃO MANUAL ===== -->
<style>
#pwaInstallPopup{display:none;position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.78);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);align-items:flex-end;justify-content:center}
#pwaInstallBox{background:var(--bg-body);width:100%;max-width:480px;border-radius:20px 20px 0 0;padding:10px 22px 38px;box-shadow:0 -8px 48px rgba(0,0,0,.55);animation:pwaSlideUp .35s cubic-bezier(.22,1,.36,1);position:relative;border-top:1px solid var(--border-color)}
.pwa-pill{width:38px;height:4px;background:var(--border-color);border-radius:4px;margin:0 auto 20px}
.pwa-close{position:absolute;top:16px;right:16px;background:var(--bg-card);border:none;color:var(--text-secondary);width:30px;height:30px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s}
.pwa-close:hover{background:var(--bg-hover);color:var(--text-white)}
.pwa-header{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.pwa-header img{width:50px;height:50px;border-radius:13px;object-fit:cover;flex-shrink:0}
.pwa-header-title{font-size:16px;font-weight:800;color:var(--text-white)}
.pwa-header-sub{font-size:12px;color:var(--text-secondary);margin-top:3px}
.pwa-tabs{display:flex;gap:8px;margin-bottom:18px;background:var(--bg-darker);border-radius:10px;padding:4px}
.pwa-tab{flex:1;padding:9px;border-radius:7px;border:none;font-size:13px;font-weight:600;cursor:pointer;background:transparent;color:var(--text-secondary);transition:.2s;font-family:var(--font-main)}
.pwa-tab.active{background:var(--accent-green);color:#011e28;font-weight:700}
.pwa-step{display:flex;align-items:flex-start;gap:14px;margin-bottom:14px}
.pwa-step-icon{min-width:38px;height:38px;border-radius:11px;background:var(--bg-card);border:1px solid var(--border-color);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pwa-step-icon svg{width:18px;height:18px;fill:var(--accent-green)}
.pwa-step-num{min-width:38px;height:38px;border-radius:11px;background:var(--bg-card);border:1px solid var(--border-color);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:13px;font-weight:800;color:var(--accent-green)}
.pwa-step-text{padding-top:9px;font-size:13px;color:var(--text-secondary);line-height:1.55}
.pwa-step-text b{color:var(--text-white)}
.pwa-tip{background:var(--bg-darker);border-radius:10px;padding:12px 14px;margin-top:8px;display:flex;align-items:center;gap:10px;border:1px solid var(--border-color)}
.pwa-tip svg{width:16px;height:16px;flex-shrink:0;fill:var(--warning)}
.pwa-tip span{font-size:12px;color:var(--text-secondary);line-height:1.5}
.pwa-tip span b{color:var(--text-white)}
@keyframes pwaSlideUp{from{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes pwaSlideDown{from{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:0}}
</style>
<div id="pwaInstallPopup">
    <div id="pwaInstallBox">
        <div class="pwa-pill"></div>
        <button class="pwa-close" onclick="closePwaPopup()" aria-label="Fechar">
            <svg viewBox="0 0 24 24" width="14" height="14" fill="currentColor"><path d="M18 6L6 18M6 6l12 12" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"/></svg>
        </button>

        <!-- Header -->
        <div class="pwa-header">
            <img src="<?php echo htmlspecialchars($_pwaIcon); ?>" alt="<?php echo htmlspecialchars($siteName); ?>">
            <div>
                <div class="pwa-header-title"><?php echo htmlspecialchars($siteName); ?></div>
                <div class="pwa-header-sub">Instale o app para a melhor experiência</div>
            </div>
        </div>

        <!-- Tabs -->
        <div class="pwa-tabs">
            <button class="pwa-tab active" id="tabAndroid" onclick="pwaSwitchTab('android')">
                <svg viewBox="0 0 24 24" width="13" height="13" fill="currentColor" style="margin-right:5px;vertical-align:-1px"><path d="M6 18c0 .55.45 1 1 1h1v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h2v3.5c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5V19h1c.55 0 1-.45 1-1V8H6v10zM3.5 8C2.67 8 2 8.67 2 9.5v7c0 .83.67 1.5 1.5 1.5S5 17.33 5 16.5v-7C5 8.67 4.33 8 3.5 8zm17 0c-.83 0-1.5.67-1.5 1.5v7c0 .83.67 1.5 1.5 1.5s1.5-.67 1.5-1.5v-7c0-.83-.67-1.5-1.5-1.5zm-4.97-5.84l1.3-1.3c.2-.2.2-.51 0-.71-.2-.2-.51-.2-.71 0l-1.48 1.48A5.846 5.846 0 0 0 12 1.5c-.96 0-1.86.23-2.66.63L7.85.65c-.2-.2-.51-.2-.71 0-.2.2-.2.51 0 .71l1.31 1.31A5.96 5.96 0 0 0 6 7h12a5.96 5.96 0 0 0-2.47-4.84zM10 5H9V4h1v1zm5 0h-1V4h1v1z"/></svg>
                Android
            </button>
            <button class="pwa-tab" id="tabIos" onclick="pwaSwitchTab('ios')">
                <svg viewBox="0 0 24 24" width="13" height="13" fill="currentColor" style="margin-right:5px;vertical-align:-1px"><path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.8-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z"/></svg>
                iPhone / iPad
            </button>
        </div>

        <!-- Passos Android -->
        <div id="pwaContentAndroid">
            <div class="pwa-step">
                <div class="pwa-step-num">1</div>
                <div class="pwa-step-text">Abra o site no <b>Google Chrome</b> e toque nos <b>3 pontos</b> no canto superior direito</div>
            </div>
            <div class="pwa-step">
                <div class="pwa-step-icon">
                    <svg viewBox="0 0 24 24"><path d="M19 13H13v6h-2v-6H5v-2h6V5h2v6h6v2z"/></svg>
                </div>
                <div class="pwa-step-text">Selecione <b>"Adicionar à tela inicial"</b> ou <b>"Instalar app"</b></div>
            </div>
            <div class="pwa-step">
                <div class="pwa-step-icon">
                    <svg viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
                </div>
                <div class="pwa-step-text">Toque em <b>Instalar</b> e o app será adicionado à sua tela inicial</div>
            </div>
        </div>

        <!-- Passos iOS -->
        <div id="pwaContentIos" style="display:none">
            <div class="pwa-step">
                <div class="pwa-step-num">1</div>
                <div class="pwa-step-text">Abra o site no <b>Safari</b> e toque no ícone de <b>Compartilhar</b> na barra inferior</div>
            </div>
            <div class="pwa-step">
                <div class="pwa-step-icon">
                    <svg viewBox="0 0 24 24"><path d="M17 14v4H7v-4H5v4c0 1.1.9 2 2 2h10c1.1 0 2-.9 2-2v-4h-2zm-5 1l-4-4h2.55V5h2.9v6H16l-4 4z"/></svg>
                </div>
                <div class="pwa-step-text">Role a lista e toque em <b>"Adicionar à Tela de Início"</b></div>
            </div>
            <div class="pwa-step">
                <div class="pwa-step-icon">
                    <svg viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
                </div>
                <div class="pwa-step-text">Toque em <b>Adicionar</b> no canto superior direito para confirmar</div>
            </div>
        </div>

        <!-- Dica -->
        <div class="pwa-tip">
            <svg viewBox="0 0 24 24"><path d="M12 2a7 7 0 0 1 7 7c0 2.62-1.44 4.9-3.57 6.13L15 17H9l-.43-1.87A7.002 7.002 0 0 1 5 9a7 7 0 0 1 7-7zm1 15v1h-2v-1h2zm-1 3a1 1 0 1 0 0 2 1 1 0 0 0 0-2z"/></svg>
            <span>Use o <b>Chrome</b> no Android ou o <b>Safari</b> no iPhone para conseguir instalar o app.</span>
        </div>
    </div>
</div>
<!-- ===================================== -->

<?php include 'topbar.php'; ?>
<?php include 'gift-alert.php'; ?>

<?php if ($sportsEnabled || $casinoEnabled || $landpageEnabled): ?>
<div class="main-nav">
<div class="nav-container">
<?php if ($landpageEnabled && !$sportsEnabled): ?>
<a href="./" class="nav-link"><i class="fas fa-home"></i><span>Início</span></a>
<?php endif; ?>
<?php if ($sportsEnabled): ?>
<a href="./" class="nav-link"><i class="fas fa-futbol"></i><span>Esportes</span></a>
<?php endif; ?>
<?php if ($casinoEnabled): ?>
<a href="cassino" class="nav-link active"><i class="fas fa-dice"></i><span>Cassino</span></a>
<?php endif; ?>
</div>
</div>
<?php endif; ?>

<?php if (!empty($banners)): ?>
<div class="banner-carousel-container">
<div class="banner-carousel">
<?php foreach ($banners as $index => $banner): ?>
<div class="banner-slide <?php echo $index === 0 ? 'active' : ''; ?>">
<?php if ($banner['link']): ?>
<a href="<?php echo htmlspecialchars($banner['link']); ?>" target="_blank" rel="noopener"><img src="<?php echo htmlspecialchars($banner['image']); ?>" alt="<?php echo htmlspecialchars($banner['title'] ?? 'Banner'); ?>"></a>
<?php else: ?>
<img src="<?php echo htmlspecialchars($banner['image']); ?>" alt="<?php echo htmlspecialchars($banner['title'] ?? 'Banner'); ?>">
<?php endif; ?>
</div>
<?php endforeach; ?>
</div>
<?php if (count($banners) > 1): ?>
<div class="banner-indicators">
<?php foreach ($banners as $index => $banner): ?>
<button class="banner-indicator <?php echo $index === 0 ? 'active' : ''; ?>" onclick="goToSlide(<?php echo $index; ?>)" aria-label="Ir para slide <?php echo $index + 1; ?>"></button>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div>
<?php endif; ?>

<div class="container">
<div class="search-bar"><i class="fas fa-search search-icon" id="searchIcon"></i><div class="search-spinner" id="searchSpinner"></div><input type="text" id="searchInput" placeholder="Buscar jogos..." oninput="searchGames()"></div>
<div id="sectionsContainer">
<?php foreach ($gamesByProvider as $providerId => $provider): ?>
<div class="game-section" data-provider="<?php echo $providerId; ?>">
<div class="section-header">
<div class="section-title">
<i class="fas fa-gamepad"></i>
<span><?php echo htmlspecialchars($provider['name']); ?></span>
<span class="game-count">(<?php echo count($provider['games']); ?>)</span>
</div>
<div class="section-actions">
<button class="btn-ver-todos" onclick="abrirModalVerTodos(<?php echo $providerId; ?>, '<?php echo htmlspecialchars($provider['name'], ENT_QUOTES); ?>')">
<i class="fas fa-th"></i>
Ver Todos
</button>
<div class="nav-buttons">
<button class="nav-btn" onclick="scrollCarousel(<?php echo $providerId; ?>, 'left')"><i class="fas fa-chevron-left"></i></button>
<button class="nav-btn" onclick="scrollCarousel(<?php echo $providerId; ?>, 'right')"><i class="fas fa-chevron-right"></i></button>
</div>
</div>
</div>
<div class="games-carousel">
<div class="games-scroll" id="carousel-<?php echo $providerId; ?>">
<?php foreach ($provider['games'] as $game): ?>
<div class="game-card" 
     onclick="selectGameCard(this)"
     data-code="<?php echo htmlspecialchars($game['game_code'], ENT_QUOTES); ?>"
     data-provider="<?php echo htmlspecialchars($game['provider_code'], ENT_QUOTES); ?>"
     data-original="<?php echo $game['is_original']; ?>"
     data-name="<?php echo htmlspecialchars($game['name'], ENT_QUOTES); ?>">
<?php if ($game['featured']): ?><span class="game-badge">Novo</span><?php endif; ?>
<div class="game-image-wrapper">
<?php if ($game['image']): ?>
<img src="<?php echo htmlspecialchars($game['image']); ?>" alt="<?php echo htmlspecialchars($game['name']); ?>" loading="lazy" onerror="this.style.display='none'; this.nextElementSibling.style.display='block';"><i class="fas fa-gamepad game-image-placeholder" style="display: none;"></i>
<?php else: ?>
<i class="fas fa-gamepad game-image-placeholder"></i>
<?php endif; ?>
</div>
<div class="game-overlay">
<button class="game-play-btn" onclick="event.stopPropagation();launchGame('<?php echo $game['game_code']; ?>', '<?php echo $game['provider_code']; ?>', <?php echo $game['is_original']; ?>, '<?php echo htmlspecialchars($game['name'], ENT_QUOTES); ?>')">
<svg viewBox="0 0 24 24"><path d="M8 5v14l11-7z"/></svg>
</button>
<div class="game-name"><?php echo htmlspecialchars($game['name']); ?></div>
<div class="game-provider"><?php echo htmlspecialchars($provider['name']); ?></div>
</div>
</div>
<?php endforeach; ?>
</div>
</div>
</div>
<?php endforeach; ?>
</div>
<?php if (empty($gamesByProvider)): ?>
<div class="no-games"><i class="fas fa-gamepad" style="font-size: 48px; opacity: 0.5; margin-bottom: 20px;"></i><p style="font-size: 16px; font-weight: 600;">Nenhum jogo disponível no momento</p></div>
<?php endif; ?>
</div>

<div class="game-modal" id="gameModal">
<div class="modal-content">
<div class="modal-header"><div class="modal-title" id="modalTitle">Carregando...</div><button class="close-btn" onclick="closeGame()"><i class="fas fa-times"></i></button></div>
<iframe id="gameIframe" class="game-iframe" allow="autoplay; fullscreen"></iframe>
</div>
</div>

<div class="error-modal" id="errorModal">
<div class="error-content">
<div class="error-icon"><i class="fas fa-exclamation-triangle"></i></div>
<div class="error-title" id="errorTitle">Ops! Algo deu errado</div>
<div class="error-message" id="errorMessage">Ocorreu um erro ao processar sua solicitação.</div>
<div class="error-buttons"><button class="error-btn error-btn-primary" onclick="closeErrorModal()"><i class="fas fa-check"></i> Entendi</button></div>
</div>
</div>

<?php include 'user-login.php'; ?>
<?php include 'free-spins-modal.php'; ?>
<?php include 'ver-todos.php'; ?>
<?php include 'footer.php'; ?>

<script>
// ===== APP BANNER – PWA INSTALL =====
(function(){
    const BANNER_KEY = 'appBannerDismissed';
    let deferredPrompt = null;

    function isDismissed(){
        if (window._pwabannerClosedThisLoad) return true;
        if (sessionStorage.getItem('appBannerDismissed')) return true;
        const v = localStorage.getItem(BANNER_KEY);
        return v && Date.now() < parseInt(v, 10);
    }

    function showBanner(){
        if (!<?php echo $pwaBannerEnabled ? 'true' : 'false'; ?>) return;
        if (isDismissed()) return;
        const banner = document.getElementById('appBanner');
        if (banner) banner.classList.remove('hidden');
    }

    // Captura o prompt nativo quando disponível
    window.addEventListener('beforeinstallprompt', function(e){
        e.preventDefault();
        deferredPrompt = e;
        showBanner();
    });

    // Se já instalou como PWA, esconde definitivamente
    window.addEventListener('appinstalled', function(){
        document.getElementById('appBanner').classList.add('hidden');
        localStorage.setItem(BANNER_KEY, Date.now() + 365 * 24 * 60 * 60 * 1000);
        deferredPrompt = null;
    });

    document.addEventListener('DOMContentLoaded', function(){
        // Mostra o banner sempre — independente de ter prompt nativo ou não
        showBanner();

        document.getElementById('appBannerLink').addEventListener('click', function(){
            if (deferredPrompt) {
                // Tem prompt nativo — usa ele
                deferredPrompt.prompt();
                deferredPrompt.userChoice.then(function(result){
                    if (result.outcome === 'accepted') {
                        document.getElementById('appBanner').classList.add('hidden');
                    }
                    deferredPrompt = null;
                });
            } else {
                // Sem prompt nativo — abre instruções manuais
                openPwaPopup();
            }
        });
    });
})();

function askDismissBanner(){
    document.getElementById('bdDontShowCheck').checked = false;
    document.getElementById('bannerDismissPopup').classList.add('active');
}

function cancelDismissBanner(){
    document.getElementById('bannerDismissPopup').classList.remove('active');
    // Não marcou checkbox → banner continua aparecendo normalmente
}

function confirmDismissBanner(){
    const check = document.getElementById('bdDontShowCheck').checked;
    document.getElementById('bannerDismissPopup').classList.remove('active');
    document.getElementById('appBanner').classList.add('hidden');

    if (check) {
        // Marcou → persiste até meia-noite (localStorage)
        const endOfDay = new Date(); endOfDay.setHours(23,59,59,999);
        localStorage.setItem('appBannerDismissed', endOfDay.getTime().toString());
        sessionStorage.setItem('appBannerDismissed', '1');
    } else {
        // Não marcou → só bloqueia o beforeinstallprompt nessa página
        // sem salvar nada: ao atualizar o banner volta normalmente
        window._pwabannerClosedThisLoad = true;
    }
}

function dismissAppBanner(){ askDismissBanner(); }

function openPwaPopup(){
    const isIos = /iphone|ipad|ipod/i.test(navigator.userAgent);
    pwaSwitchTab(isIos ? 'ios' : 'android');
    const popup = document.getElementById('pwaInstallPopup');
    popup.style.display = 'flex';
    document.body.style.overflow = 'hidden';
}

function closePwaPopup(){
    const box = document.getElementById('pwaInstallBox');
    box.style.animation = 'pwaSlideDown .25s ease forwards';
    setTimeout(function(){
        document.getElementById('pwaInstallPopup').style.display = 'none';
        box.style.animation = '';
        document.body.style.overflow = '';
    }, 240);
}

function pwaSwitchTab(tab){
    const isAndroid = tab === 'android';
    document.getElementById('pwaContentAndroid').style.display = isAndroid ? 'block' : 'none';
    document.getElementById('pwaContentIos').style.display     = isAndroid ? 'none'  : 'block';
    document.getElementById('tabAndroid').classList.toggle('active', isAndroid);
    document.getElementById('tabIos').classList.toggle('active', !isAndroid);
}

// Fechar clicando fora
document.addEventListener('DOMContentLoaded', function(){
    document.getElementById('pwaInstallPopup').addEventListener('click', function(e){
        if (e.target === this) closePwaPopup();
    });
});
// =====================================

// ===== REMOVER CONFIRMAÇÃO DE SAÍDA =====
window.onbeforeunload = null;
Object.defineProperty(window, 'onbeforeunload', {
    set: function(value) {},
    get: function() { return null; }
});

const isLoggedIn = <?php echo $isLoggedIn ? 'true' : 'false'; ?>;
let userBalance = <?php echo $isLoggedIn ? $userBalance : 0; ?>;
const gameOpenMode = <?php echo $gameOpenMode; ?>;

function showErrorModal(title, message){const modal=document.getElementById('errorModal');const titleEl=document.getElementById('errorTitle');const messageEl=document.getElementById('errorMessage');const buttonsEl=document.querySelector('.error-buttons');titleEl.textContent=title;messageEl.textContent=message;buttonsEl.innerHTML='<button class="error-btn error-btn-primary" onclick="closeErrorModal()"><i class="fas fa-check"></i> Entendi</button>';modal.classList.add('active');document.body.style.overflow='hidden'}

function showErrorModalWithButton(title, message, buttonText, buttonUrl){const modal=document.getElementById('errorModal');const titleEl=document.getElementById('errorTitle');const messageEl=document.getElementById('errorMessage');const buttonsEl=document.querySelector('.error-buttons');titleEl.textContent=title;messageEl.textContent=message;buttonsEl.innerHTML='<button class="error-btn error-btn-secondary" onclick="closeErrorModal()"><i class="fas fa-times"></i> Fechar</button><button class="error-btn error-btn-primary" onclick="window.open(\''+buttonUrl+'\', \'_blank\')"><i class="fas fa-external-link-alt"></i> '+buttonText+'</button>';modal.classList.add('active');document.body.style.overflow='hidden'}

function closeErrorModal(){const modal=document.getElementById('errorModal');modal.classList.remove('active');document.body.style.overflow=''}
document.addEventListener('click',function(e){const modal=document.getElementById('errorModal');if(e.target===modal){closeErrorModal()}});

let currentSlide=0;let totalSlides=<?php echo count($banners); ?>;let autoPlayInterval;
function goToSlide(index){if(index<0)index=totalSlides-1;if(index>=totalSlides)index=0;document.querySelectorAll('.banner-slide').forEach(slide=>{slide.classList.remove('active')});document.querySelectorAll('.banner-indicator').forEach(indicator=>{indicator.classList.remove('active')});document.querySelectorAll('.banner-slide')[index].classList.add('active');document.querySelectorAll('.banner-indicator')[index].classList.add('active');currentSlide=index;resetAutoPlay()}
function nextSlide(){goToSlide(currentSlide+1)}
function startAutoPlay(){if(totalSlides>1){autoPlayInterval=setInterval(nextSlide,5000)}}
function resetAutoPlay(){clearInterval(autoPlayInterval);startAutoPlay()}
document.addEventListener('DOMContentLoaded',function(){startAutoPlay();document.querySelectorAll('.banner-slide').forEach((slide,index)=>{slide.addEventListener('click',function(e){if(!this.querySelector('a')){e.preventDefault();nextSlide()}})})});

const carouselContainer=document.querySelector('.banner-carousel-container');if(carouselContainer){carouselContainer.addEventListener('mouseenter',function(){clearInterval(autoPlayInterval)});carouselContainer.addEventListener('mouseleave',function(){startAutoPlay()})}

function openModal(modalId){const modal=document.getElementById(modalId);if(modal){modal.classList.add('active');document.body.style.overflow='hidden'}}
function closeModal(modalId){const modal=document.getElementById(modalId);if(modal){modal.classList.remove('active');document.body.style.overflow=''}}

function scrollCarousel(providerId,direction){const carousel=document.getElementById('carousel-'+providerId);if(!carousel)return;const scrollAmount=carousel.offsetWidth;const currentScroll=carousel.scrollLeft;if(direction==='left'){carousel.scrollLeft=currentScroll-scrollAmount}else{carousel.scrollLeft=currentScroll+scrollAmount}}

async function launchGame(gameCode,providerCode,isOriginal,gameName){
    if(!isLoggedIn){
        console.log('Usuário não logado - abrindo modal de login');
        openModal('loginModal');
        return;
    }
    
    if(gameOpenMode === 1){
        try {
            const response = await fetch('api/get-game-id.php?code=' + gameCode + '&provider=' + providerCode);
            const data = await response.json();
            if(data.success && data.game_id){
                window.location.href = 'jogo?id=' + data.game_id;
                return;
            }
        } catch(error) {
            console.error('Erro ao buscar ID do jogo:', error);
        }
    }
    
    const modal=document.getElementById('gameModal');
    const iframe=document.getElementById('gameIframe');
    const title=document.getElementById('modalTitle');
    
    title.textContent='Carregando '+gameName+'...';
    modal.classList.add('active');
    document.body.style.overflow='hidden';
    iframe.src='';
    
    try{
        const response=await fetch('api/casino-launch.php',{
            method:'POST',
            headers:{'Content-Type':'application/json'},
            body:JSON.stringify({
                game_code:gameCode,
                provider:providerCode,
                game_original:isOriginal===1
            })
        });
        const data=await response.json();
        
        if(data.success){
            iframe.src=data.launch_url;
            title.textContent=gameName;
            
            const giftAlert=document.getElementById('giftAlert');
            if(giftAlert){
                giftAlert.style.display='none';
            }
            
            if(typeof fbq!=='undefined'){
                fbq('track','ViewContent',{
                    content_name:gameName,
                    content_category:'Casino Game',
                    content_type:'game',
                    content_ids:[gameCode],
                    provider:providerCode
                });
            }
        }else{
            if(data.message&&data.message.includes('IP não autorizado')){
                const checkIpUrl = window.location.origin+'/api/check-ip.php';
                showErrorModalWithButton(
                    'IP não autorizado',
                    'O IP do seu servidor não está autorizado na PlayFivers.\n\nClique no botão abaixo para descobrir seu IP e depois adicione na whitelist do painel da PlayFivers.',
                    'Descobrir Meu IP',
                    checkIpUrl
                );
            }else if(data.message&&(data.message.includes('422')||data.message.includes('saldo')||data.message.includes('Saldo')||data.message.includes('insuficiente'))){
                showErrorModal('Provedor em Manutenção','Este provedor está temporariamente indisponível.\n\nTente outro jogo ou volte mais tarde.');
            }else{
                showErrorModal('Erro ao Carregar',data.message||'Não foi possível carregar o jogo. Tente novamente.');
            }
            closeGame();
        }
    }catch(error){
        console.error('Erro ao lançar jogo:',error);
        showErrorModal('Erro de Conexão','Não foi possível conectar ao servidor.\n\nVerifique sua internet e tente novamente.');
        closeGame();
    }
}

function closeGame(){
    window.onbeforeunload = null;
    
    const modal=document.getElementById('gameModal');
    const iframe=document.getElementById('gameIframe');
    
    iframe.src='about:blank';
    modal.classList.remove('active');
    document.body.style.overflow='';
    
    setTimeout(() => {
        iframe.src='';
    }, 100);
    
    if(isLoggedIn){
        fetch('api/get-balance.php').then(r=>r.json()).then(d=>{
            if(d.success){
                userBalance=parseFloat(d.balance);
                if(typeof updateHeaderBalance==='function'){
                    updateHeaderBalance();
                }
            }
        }).catch(err=>console.error('Erro ao atualizar saldo:',err));
        
        if(typeof checkGiftAlert==='function'){
            checkGiftAlert();
        }
    }
}

// Primeiro clique no card: mostra overlay. Clique fora: deseleciona.
function selectGameCard(card){
    if(!isLoggedIn){ openModal('loginModal'); return; }
    document.querySelectorAll('.game-card.selected').forEach(function(c){
        if(c !== card) c.classList.remove('selected');
    });
    card.classList.toggle('selected');
}
document.addEventListener('click', function(e){
    if(!e.target.closest('.game-card')){
        document.querySelectorAll('.game-card.selected').forEach(function(c){ c.classList.remove('selected'); });
    }
});

document.addEventListener('DOMContentLoaded',function(){document.querySelectorAll('.game-card').forEach(card=>{card.addEventListener('click',function(e){if(!isLoggedIn){e.stopPropagation();e.preventDefault();console.log('Click interceptado - abrindo login');openModal('loginModal');return false}},true)})});

let _srTimer=null;
function searchGames(){
    const spinner=document.getElementById('searchSpinner');
    const icon=document.getElementById('searchIcon');
    spinner.style.display='block'; icon.style.display='none';
    clearTimeout(_srTimer);
    _srTimer=setTimeout(()=>{
        const searchTerm=document.getElementById('searchInput').value.toLowerCase();
        const sections=document.querySelectorAll('.game-section');
        sections.forEach(section=>{
            const cards=section.querySelectorAll('.game-card');
            let hasVisible=false;
            cards.forEach(card=>{
                const gameName=card.querySelector('.game-name')?.textContent.toLowerCase()||'';
                const gameProvider=card.querySelector('.game-provider')?.textContent.toLowerCase()||'';
                const gameAlt=card.querySelector('img')?.alt.toLowerCase()||'';
                if(searchTerm===''||gameName.includes(searchTerm)||gameProvider.includes(searchTerm)||gameAlt.includes(searchTerm)){card.style.display='';hasVisible=true}
                else{card.style.display='none'}
            });
            section.style.display=hasVisible?'':'none';
        });
        spinner.style.display='none'; icon.style.display='block';
    }, 220);
}

document.addEventListener('keydown',function(e){if(e.key==='Escape')closeGame()});

function checkCasinoRollover(){if(!isLoggedIn)return;fetch('api/casino-rollover-check.php',{method:'POST'}).then(r=>r.json()).then(data=>{if(data.success){if(data.contribution){console.log('🎰 Rollover Cassino atualizado:',{aposta_detectada:'R$ '+data.bet_detected.toFixed(2),contribuicao:'R$ '+data.contribution.toFixed(2),falta:'R$ '+data.rollover_pending.toFixed(2)});if(typeof updateHeaderBalance==='function'){updateHeaderBalance()}if(data.completed){showErrorModal('Rollover Completo!','Parabéns! Você completou o rollover.\n\nVocê já pode fazer saques!')}}}}).catch(err=>console.error('Erro ao checar rollover:',err))}
// ===== REGISTRAR SERVICE WORKER =====
if ('serviceWorker' in navigator) {
    window.addEventListener('load', function() {
        navigator.serviceWorker.register('/sw.js', { scope: '/' })
            .then(function(reg) { console.log('[SW] Registrado:', reg.scope); })
            .catch(function(err) { console.warn('[SW] Falha:', err); });
    });
}
</script>

<?php include 'tabbar.php'; ?>
<?php include 'popup_roulette.php'; ?>
</body>
</html>